<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
		<el-row style="display:flex;flex-direction:rows">
			<el-col :span="4">
				<span class="title">客户编号:</span>
				<el-input v-model="form.custNum"  placeholder="输入客户编号" style="width: 200px;" class="filter-item" @keyup.enter.native="list"/>
			</el-col>
			<el-col :span="4">
				<span class="title">客户名称:</span>
				<el-input v-model="form.custName"  placeholder="输入客户名称" style="width: 200px;" class="filter-item" @keyup.enter.native="list"/>
			</el-col>
		

			<!-- 搜索 -->
			<!-- <el-input v-model="query.value" clearable placeholder="输入搜索内容" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery"/>
			<el-select v-model="query.type" clearable placeholder="类型" class="filter-item" style="width: 130px">
				<el-option v-for="item in queryTypeOptions" :key="item.key" :label="item.display_name" :value="item.key"/>
			</el-select> -->
			<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="list">搜索</el-button>
			<el-button class="filter-item" size="mini" type="success" icon="el-icon-delete-solid" @click="resetSearch">清空</el-button>
			<el-button class="filter-item" size="mini" type="success" icon="el-icon-view" @click="toDetails">详情</el-button>
			<!-- 新增 -->
			<!-- <div style="display: inline-block;margin: 0px 2px;">
				<el-button
				v-permission="['ADMIN','CUSTCOMBASEINFO_ALL','CUSTCOMBASEINFO_CREATE']"
				class="filter-item"
				size="mini"
				type="primary"
				icon="el-icon-plus"
				@click="add">新增</el-button>
			</div> -->
	   </el-row>
    </div>
    <!--表单组件-->
    <!-- <eForm ref="form" :is-add="isAdd"/> -->
    <!--表格渲染-->
    <el-table v-loading="loading" :data="data" size="small" style="width: 100%;"   @selection-change="handleSelectionChange">
	  <el-table-column type="selection" width="50"></el-table-column>
      <el-table-column prop="custNum" label="客户编号"/>
      <el-table-column prop="custName" label="客户名称"/>
      <el-table-column prop="certificateType" label="证件类型"/>
      <el-table-column prop="certificateNum" label="证件编号"/>
      <el-table-column prop="custType" label="客户类型"/>
      <el-table-column prop="custStatus" label="客户状态"/>
      <el-table-column prop="accountManagerName" label="客户经理"/>
      <el-table-column prop="managerDept" label="管理机构"/>
      <!-- <el-table-column v-if="checkPermission(['ADMIN','CUSTCOMBASEINFO_ALL','CUSTCOMBASEINFO_EDIT','CUSTCOMBASEINFO_DELETE'])" label="操作" width="150px" align="center">
        <template slot-scope="scope">
          <el-button v-permission="['ADMIN','CUSTCOMBASEINFO_ALL','CUSTCOMBASEINFO_EDIT']" size="mini" type="primary" icon="el-icon-edit" @click="edit(scope.row)"/>
          <el-popover
            v-permission="['ADMIN','CUSTCOMBASEINFO_ALL','CUSTCOMBASEINFO_DELETE']"
            :ref="scope.row.id"
            placement="top"
            width="180">
            <p>确定删除本条数据吗？</p>
            <div style="text-align: right; margin: 0">
              <el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button>
              <el-button :loading="delLoading" type="primary" size="mini" @click="subDelete(scope.row.id)">确定</el-button>
            </div>
            <el-button slot="reference" type="danger" icon="el-icon-delete" size="mini"/>
          </el-popover>
        </template>
      </el-table-column> -->
    </el-table>
    <!--分页组件-->
    <el-pagination
      :total="total"
      :current-page="page + 1"
      style="margin-top: 8px;"
      layout="total, prev, pager, next, sizes"
      @size-change="sizeChange"
      @current-change="pageChange"/>
  </div>
</template>

<script>
import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData'
import { toAliPay } from '@/api/alipay'
import { del,list } from '@/api/custPerBaseinfo'
import { parseTime } from '@/utils/index'
import eForm from './form'
export default {
  components: { eForm },
  mixins: [initData],
  data() {
    return {
      form:{
		page: 0, 
		size: 10,
		sort:'id,desc',
		custNum:'',
		custName:''
	  },
	  ids:[],
	  id:'',
	  loading:true,
      delLoading: false,
      queryTypeOptions: [
        { key: 'custNum', display_name: '客户编号' },
        { key: 'custName', display_name: '客户名称' }
      ]
    }
  },
  created() {
    this.$nextTick(() => {
	 // this.init()
	 this.list()
    })
  },
  methods: {
    parseTime,
    checkPermission,
    beforeInit() {
      this.url = 'api/custComBaseinfo'
      const sort = 'id,desc'
      this.params = { page: this.page, size: this.size, sort: sort }
      const query = this.query
      const type = query.type
      const value = query.value
      if (type && value) { this.params[type] = value }
      return true
	},
	 list (){
        list(this.form).then(res => {
            this.total = res.totalElements
			this.data = res.content
			setTimeout(() => {
                this.loading = false
             }, 170)
          }).catch(err => {
            this.loading = false
            console.log(err.response.data.message)
          })
	   }, 
	   resetSearch(){
		   this.form.custNum = '';
		   this.form.custName = '';
		   this.list()
		   setTimeout(() => {
                this.loading = false
           }, 170)
	   },
	    handleSelectionChange(val) {
		  console.log('val',val)
		   val.forEach((v) => {
               this.ids.push(v.id)
		   });
		   console.log('ids',this.ids)
		   this.id = this.ids.toString()
		   this.ids = []
	   },
	   toDetails(){
		   sessionStorage.setItem('perCustId',this.id)
		   this.$router.push({ name: "perDetailss", params: { id :this.id} })  
		   console.log('id',this.$route.params.id)
	   },
	   


	    select(selection){
			console.log('selection',selection)
                // this.ids = [];
                // selection.forEach((v) => {
                //     this.ids.push(v.id)
                // });
                //this.$emit('getCusids', this.ids);
		},
		selectable(row, index) {
			console.log('row',row)
			console.log('index',index)
                // return !this.qmsCate.some(_cate => {
                //     return _cate.categoryName == row.categoryTitle;
                // });
         },
	   toAliPay (){
         toAliPay(url, this.form).then(res => {
			this.loading = false
			this.total = res.totalElements
			this.data = res.content
			setTimeout(() => {
                this.loading = false
             }, 170)
          }).catch(err => {
            this.loading = false
            console.log(err.response.data.message)
          })
	   },   
    subDelete(id) {
      this.delLoading = true
      del(id).then(res => {
        this.delLoading = false
        this.$refs[id].doClose()
        this.dleChangePage()
        this.init()
        this.$notify({
          title: '删除成功',
          type: 'success',
          duration: 2500
        })
      }).catch(err => {
        this.delLoading = false
        this.$refs[id].doClose()
        console.log(err.response.data.message)
      })
    },
    add() {
      this.isAdd = true
      this.$refs.form.dialog = true
    },
    edit(data) {
      this.isAdd = false
      const _this = this.$refs.form
      _this.form = {
        id: data.id,
        custNum: data.custNum,
        custName: data.custName,
        credentialType: data.credentialType,
        credentialNum: data.credentialNum,
        custType: data.custType,
        custStatus: data.custStatus,
        accountManagerName: data.accountManagerName,
        managerDept: data.managerDept,
        industry: data.industry,
        subBranch: data.subBranch,
        deptCode: data.deptCode,
        industrialAdjustType: data.industrialAdjustType,
        customerScaleIn: data.customerScaleIn,
        registPlace: data.registPlace,
        isRegistOverCounty: data.isRegistOverCounty,
        industryKind: data.industryKind,
        industryBigKind: data.industryBigKind,
        industryMidKind: data.industryMidKind,
        industrySmallKind: data.industrySmallKind,
        jobPeopleNum: data.jobPeopleNum,
        businessIncome: data.businessIncome,
        businessSale: data.businessSale,
        ledgerStatus: data.ledgerStatus,
        realBusinessAddr: data.realBusinessAddr,
        province: data.province,
        preLevelCity: data.preLevelCity,
        riskLevel: data.riskLevel,
        foundDate: data.foundDate,
        isExportType: data.isExportType,
        isImportType: data.isImportType,
        legalRepresent: data.legalRepresent,
        realController: data.realController,
        custBankRelationship: data.custBankRelationship,
        buildCreditTime: data.buildCreditTime,
        isLeadingEnterprise: data.isLeadingEnterprise,
        isHighTechEnterprise: data.isHighTechEnterprise,
        isSupportNewTechEnterprise: data.isSupportNewTechEnterprise,
        isSupportEnergySaveEnterprise: data.isSupportEnergySaveEnterprise,
        isFarmerEnterprise: data.isFarmerEnterprise,
        isTop10Enterprise: data.isTop10Enterprise,
        isHighTechIndustry: data.isHighTechIndustry,
        isSupportPeopleEnterprise: data.isSupportPeopleEnterprise,
        isOtherPlaceLoan: data.isOtherPlaceLoan,
        isXixianEnterprise: data.isXixianEnterprise,
        societyRiskKind: data.societyRiskKind,
        isSuperiorityEnterprise: data.isSuperiorityEnterprise,
        isCapacityBack: data.isCapacityBack,
        isNationalMacroCtrlIndustry: data.isNationalMacroCtrlIndustry,
        isSupportWaterFarmland: data.isSupportWaterFarmland,
        isIndustrialTransformCust: data.isIndustrialTransformCust,
        relateFarmType: data.relateFarmType,
        isStrategicNewIndustry: data.isStrategicNewIndustry,
        isEliminateBackEnterprises: data.isEliminateBackEnterprises,
        isOneWayEnterprise: data.isOneWayEnterprise,
        isHighPollutionEnterprises: data.isHighPollutionEnterprises,
        isGovernentCoopEnterprise: data.isGovernentCoopEnterprise,
        isTechnologyEnterprise: data.isTechnologyEnterprise,
        enterpriseClassify: data.enterpriseClassify,
        importDate: data.importDate,
        maintainer: data.maintainer,
        accountManager: data.accountManager
      }
      _this.dialog = true
    }
  }
}
</script>

<style scoped>
.title{
	font-size:14px;
}

</style>
